<template>
  <div id="micro-app" class="application">
    <div class="page-list">
      <transition mode="out-in" appear>
        <router-view />
      </transition>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      application: window.application
    }
  },

  methods: {

  },

  mounted () {
    let lm = document.querySelector('.d-loading-maker')
    lm && (lm.style.display = 'none')
  }
}
</script>

<style lang="less">
::-webkit-scrollbar {
  display: block;
  width: 8px;
}
@media(max-width: 756px) {
  ::-webkit-scrollbar {
    display: none!important;
    width: 0px;  
    height: 0px;  
  }
}
.container-center{
  margin:0 auto !important;
  padding:0 15px !important;
  max-width: 1400px;
}
.text-require{
  color:#FF3333;
  font-style: normal;
  margin-right:2px;
  font-size:1.2em;
  vertical-align: middle;
}
.text-link{
  &,&:hover{
    cursor:pointer;
    text-decoration:none;
  }
}
.hidden{
  display: none;
}
.text-theme{
  color:#1abd9e;
}
.text-gray{
  color: #666;
}
.text-lightgray{
  color: #999;
}
.text-md{
  font-size:16px;
}
.text-break{
  word-wrap: break-word;
  word-break: normal;
}
.bg-muted{
  background:#efefef;
}
.text-move{
  cursor: move;
}
// 布局
.over-hidden{
  overflow:hidden;
}
.relative{
  position: relative;
}
.block-in {
  display: inline-block;
}
.layout-fix-bottom{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
}
.btns-bottom{
  padding: 10px 0;
  text-align: center;
  .btn{
    margin:0 5px;
  }
}
.native-clear{
  &:after{
    content:"";
    display:block;
    clear:both;
  }
}
.v-top{
  vertical-align: top;
}
.mt-lg{
  margin-top:20px;
}
.mt-md{
  margin-top:15px;
}
.mt-sm{
  margin-top:10px;
}
.mt-xs{
  margin-top: 6px;
}
.mr-xxs{
  margin-right:2px;
}
.mr-xs{
  margin-right:5px;
}
.mr-sm{
  margin-right:10px;
}
.mr-md {
  margin-right: 12px;
}
.mb-xs{
  margin-bottom:5px;
}
.mb-sm{
  margin-bottom:10px;
}
.ml-xs{
  margin-left:5px;
}
.ml-sm{
  margin-left:10px;
}
.pt-sm{
  padding-top: 10px;
}
.pb-sm{
  padding-bottom: 10px;
}
.box-flex{
  display: flex;
}
.wide-xxs{
  width:30px;
}
.wide-xs{
  width:65px;
}
.wide-sm{
  width:100px;
}
.wide-smd{
  width:110px;
}
.wide-md{
  width:140px;
}
.wide-xmd{
  width:180px;
}
.wide-lg{
  width:200px;
}
.wide-xxl{
  width:400px;
}
.vlign-mid{
  vertical-align: middle;
}
.table>tbody>tr>td{
  &.vlign-mid{
    vertical-align: middle;
  }
}
.highlight {
  padding: 9px 14px;
  margin-bottom: 14px;
  background-color: #f7f7f9;
  border: 1px solid #e1e1e8;
  border-radius: 4px;
}
.drager-param{
  position: fixed;
  display: none;
  border: 1px dashed #999;
  background:rgba(255, 255, 255, .7)
}
.ico-pointer{
  &:before{
    box-sizing: border-box;
    content:"";
    display: inline-block;
    margin-right:3px;
    width:10px;
    height:10px;
    border-radius:5px;
    border:5px solid;
  }
}
// 折叠
.collapser{
  overflow:hidden;
  max-height:0;
  transition-duration: 0.4s;
  &.expand{
    overflow:visible;
    max-height:5000px;
  }
}
// 表单默认颜色
.page {
  @color:#bbb;
  input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {// Safari and Chrome
      color:@color;
  }
  input:-moz-placeholder, textarea:-moz-placeholder {// Firefox 4-18
      color:@color;
  }
  input::-moz-placeholder, textarea::-moz-placeholder {// Firefox 19+
      color:@color;
  }
  input:-ms-input-placeholder, textarea:-ms-input-placeholder {// Internet Explorer 10+
      color:@color;
  }
}
</style>
